Skip to content

feat(themes): Add themed SVG fallbacks for API error responses#8253

Merged
JhaSourav07 merged 1 commit into
JhaSourav07:mainfrom
Rakshak05:issue-#7796
Jul 23, 2026
Merged

feat(themes): Add themed SVG fallbacks for API error responses#8253
JhaSourav07 merged 1 commit into
JhaSourav07:mainfrom
Rakshak05:issue-#7796

Conversation

@Rakshak05

@Rakshak05 Rakshak05 commented Jul 22, 2026 •
edited
Loading

Copy link
Copy Markdown
Contributor

Description

Fixes #7796

Pillar

  • 🎨 Pillar 1 — New Theme Design
  • 📐 Pillar 2 — Geometric SVG Improvement
  • 🕐 Pillar 3 — Timezone Logic Optimization
  • 🛠️ Other (Bug fix, refactoring, docs)

Visual Preview

Previously, when hitting API rate limits or facing validation errors, CommitPulse returned a generic #2d0000 (red) SVG error box which looked out of place on beautifully themed GitHub Profile READMEs.

With this PR:

  • Error responses now parse the incoming query params (theme, custom bg, accent, text, etc.) using resolveErrorTheme.
  • A matching visually-themed SVG fallback is generated via buildInlineErrorSVG containing the appropriate border radius, background, text, and accent borders.
  • Supported in /api/spotify, /api/spotlight, /api/streak, /api/wakatime, and /api/wrapped.

Example theme response when requesting theme=dracula:

<svg xmlns="http://www.w3.org/2000/svg" width="400" height="150" viewBox="0 0 400 150">
  <rect width="400" height="150" fill="#282a36" rx="8" stroke="#bd93f9" stroke-opacity="0.25" stroke-width="1"/>
  <text x="200" y="75" text-anchor="middle" dominant-baseline="central" fill="#f8f8f2" font-family="sans-serif" font-size="13">Rate Limit Exceeded</text>
</svg>

Checklist before requesting a review:

  • I have read the CONTRIBUTING.md file.
  • I have tested these changes locally (localhost:3000/api/streak?user=YOUR_USERNAME).
  • I have run npm run format and npm run lint locally and resolved all errors (CI will fail otherwise).
  • My commits follow the Conventional Commits format (e.g., feat(themes): ..., fix(calculate): ...).
  • I have updated README.md if I added a new theme or URL parameter.
  • I have started the repo.
  • I have made sure that i have only one commit to merge in this PR.
  • The SVG output matches the CommitPulse "premium quality" aesthetic standard (no raw elements, smooth animations, correct fonts).
  • (Recommended) I joined the CommitPulse Discord community for contributor discussions, mentorship, and faster PR support.

Copilot AI review requested due to automatic review settings July 22, 2026 04:48
@vercel

vercel Bot commented Jul 22, 2026

Copy link
Copy Markdown
Contributor

@Rakshak05 is attempting to deploy a commit to the jhasourav07's projects Team on Vercel.

A member of the Team first needs to authorize it.

Copilot AI reviewed Jul 22, 2026

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copilot was unable to review this pull request because the user who requested the review has reached their quota limit.

@retenta-bot

retenta-bot Bot commented Jul 22, 2026

Copy link
Copy Markdown

This pull request introduces themed SVG fallbacks for API errors, improving the visual consistency of error messages with user-selected themes. This aligns with previous decisions made to enhance theme rendering based on user preferences, ensuring a smoother user experience. Thank you for your contribution, and I look forward to your updates!

@retenta-bot retenta-bot Bot changed the title feat(themes): implement visually themed fallback SVGs for API errors (#7796) feat(themes): Add themed SVG fallbacks for API error responses Jul 22, 2026
@github-actions github-actions Bot added the status:blocked This PR is blocked due to a failing CI check. label Jul 22, 2026
@Rakshak05
Rakshak05 force-pushed the issue-#7796 branch 2 times, most recently from 95fbc74 to 00e8dbe Compare July 22, 2026 06:09
@github-actions github-actions Bot removed the status:blocked This PR is blocked due to a failing CI check. label Jul 22, 2026
@github-actions

github-actions Bot commented Jul 22, 2026

Copy link
Copy Markdown
Contributor

📦 Next.js Bundle Size Report (Gzipped Sizes)

✨ No significant bundle size changes detected.

📊 Summary of Totals

Category PR Size Base Size Difference
Total JS 3985.28 KB 3985.28 KB 0 B
Total CSS 331.41 KB 331.41 KB 0 B

@Aamod007 Aamod007 added level:critical High-priority or mission-critical contributions affecting core systems, security, or infrastructure quality:clean PR follows clean coding practices, proper formatting, documentation, and maintainability standards. type:refactor Code changes that neither fix a bug nor add a feature mentor:Aamod007 labels Jul 23, 2026
Aamod007
Aamod007 approved these changes Jul 23, 2026
View reviewed changes

@Aamod007 Aamod007 left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is a brilliant architectural refactor! Returning an inline error SVG dynamically instead of raw JSON on API errors ensures that users' README badges degrade gracefully rather than displaying broken images. The integration of
esolveErrorTheme\ ensures these fallbacks still match the requested aesthetic. The rollout across all major APIs is very well executed.

Incredible work!

Label Justification:

  • \level:critical: Assigned based on 10 files changed across multiple major API routes, introducing a new paradigm for SVG error rendering.
  • \quality:clean: Excellent unit test coverage for the theme resolver and clean fallback logic.
  • \ ype:refactor: Refactors error handling in API routes from returning JSON to returning dynamic SVGs.
  • \mentor:Aamod007: Assigned as required.

@JhaSourav07 JhaSourav07 added the gssoc:approved PR has been reviewed and accepted for valid contribution points label Jul 23, 2026
@JhaSourav07
JhaSourav07 merged commit b18e2b9 into JhaSourav07:main Jul 23, 2026
9 of 10 checks passed
@github-actions github-actions Bot added this to the GSSoC 2026 milestone Jul 23, 2026
@github-actions

github-actions Bot commented Jul 23, 2026

Copy link
Copy Markdown
Contributor

🎉 Congratulations @Rakshak05! Your PR has been successfully merged. 🚀

Thank you for contributing to CommitPulse. Your work helps us build a better tool for the community.

⚠️ Important for GSSoC Contributors:
You are strictly advised to join our Discord Server as it is mandatory for all GSSoC participants. All important announcements, point claims, and community discussions happen there.

Keep building! 💻✨

@Rakshak05
Rakshak05 deleted the issue-#7796 branch July 23, 2026 05:36
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

Copilot code review Copilot Copilot left review comments
@Aamod007 Aamod007 Aamod007 approved these changes

Assignees

No one assigned

Labels

gssoc:approved PR has been reviewed and accepted for valid contribution points level:critical High-priority or mission-critical contributions affecting core systems, security, or infrastructure mentor:Aamod007 quality:clean PR follows clean coding practices, proper formatting, documentation, and maintainability standards. type:refactor Code changes that neither fix a bug nor add a feature

Projects

None yet

Milestone

GSSoC 2026

Development

Successfully merging this pull request may close these issues.

Implement visually themed fallback SVGs for API errors

4 participants

@Rakshak05 @Aamod007 @JhaSourav07